<template>
	<view class="container">
		<view class="search">
			<image src="../../static/find.png"></image>
			<input type="text" value="" placeholder=" 请输入城市名字" confirm-type="search" @confirm="SearchInput"/>
			<view class="text1">取消</view>
		</view>
	</view>
</template>

<script>
	export default{
		methods:{

			SearchInput:function(event){
				console.log(event.detail.value)
				uni.$emit('SearchCity',{cityName:event.detail.value})
				uni.navigateBack({
					delta:1
				})
			}
		}
	}
</script>

<style>
	.container{
		position: absolute;
		width: 100%;
        height: 100%;
		background-image:url(../../static/bg/1.jpg);
		background-size: 100%;
	}
	.search{
		display: flex;
		width: 100%;
		height: 60ux;
		margin: 20upx;
	}
	image{
		width: 45upx;
		height: 45upx;
		position:absolute;
		margin-left: 490upx;
		margin-top: 10upx;
	}
	input{
		background-color: #FFFFFF;
		width: 550upx;
		height: 60upx;
		border: 5upx solid #7995bf;	
		border-radius: 15upx;
	}
	.text1{
		margin-top: 7upx;
		margin-left: 30upx;
		padding: 5upx;
		text-align: center;
		display: block;
		border-radius: 10upx;
		background-color: #7995BF;
		height: 50upx;
	    width: 100upx;
		color: #FFFFFF;
		
	}
</style>
